<template>
	<view class="float-button" :style="columnStyle" @click="onClick">
		<slot></slot>
	</view>
</template>

<script>
	export default {
		name: "FloatButton",
		props: {
			columnStyle: {
				type: [String,Object],
				default: () => {
					return {
						background: 'linear-gradient(180deg, #FF7065 0%, #FF2615 100%)'
					}
				}
			}
		},
		data() {
			return {

			};
		},
		methods: {
			onClick() {
				this.$emit('click')
			}
		}
	}
</script>

<style lang="scss">
	.float-button {
		width: calc(100% - 44upx);
		height: 91rpx;
		margin: 0 auto;
		@extend .row;
		box-shadow: 0rpx 4 7rpx 0rpx rgba(21, 26, 255, 0.1);
		border-radius: 45rpx;
		font-size: 29rpx;
		font-family: PingFangSC, PingFang SC;
		font-weight: 400;
		color: #FFFFFF;
	}
</style>